<template>
<!--  商品分类页面-->
	<el-card shadow="never" class="aui-card--fill">
		<div>
			<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
				<el-form-item>
					<el-input v-model="dataForm.groupName" placeholder="分类名称" clearable></el-input>
				</el-form-item>
				<el-form-item>
					<el-button @click="getDataList()">查询</el-button>
				</el-form-item>
				<el-form-item>
					<el-button v-if="$hasPermission('api:productGroup:save')" type="primary"
						@click="addOrUpdateHandle()">
						新增
					</el-button>
				</el-form-item>
				<el-form-item>
					<el-button v-if="$hasPermission('api:productGroup:delete')" type="danger" @click="deleteHandle()">
						删除
					</el-button>
				</el-form-item>
			</el-form>
			<el-table v-loading="dataListLoading" :data="dataList" stripe highlight-current-row
				@selection-change="dataListSelectionChangeHandle" @sort-change="dataListSortChangeHandle"
				style="width: 100%;">

				<el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
				<el-table-column prop="groupName" label="商品分类" header-align="center" align="center"
					width=""></el-table-column>
				<el-table-column prop="sort" label="排序" header-align="center" align="center" sortable
					width=""></el-table-column>
				<el-table-column prop="isShow" label="展示状态" header-align="center" align="center" sortable
					width="">
					<template slot-scope="scope">
						<el-tag v-if="scope.row.isShow === 1" size="small" type="success">
							{{ $getDictLabel("is_show", scope.row.isShow) }}
						</el-tag>
						<el-tag v-else size="small" type="info">{{
                $getDictLabel("is_show", scope.row.isShow)
              }}
						</el-tag>
					</template>
				</el-table-column>
				<el-table-column prop="createDate" label="创建日期" header-align="center" align="center"></el-table-column>
				<el-table-column label="操作" fixed="right" header-align="center" align="center" width="">
					<template slot-scope="scope">
						<el-link v-if="$hasPermission('api:productGroup:update')" type="primary"
							@click="addOrUpdateHandle(scope.row.id)">修改
						</el-link>
						<el-link v-if="$hasPermission('api:productGroup:delete')" type="primary"
							@click="deleteHandle(scope.row.id)">删除
						</el-link>
					</template>
				</el-table-column>

			</el-table>
			<el-pagination :current-page="page" :page-sizes="[10, 20, 50, 100]" :page-size="limit" :total="total"
				layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
				@current-change="pageCurrentChangeHandle">
			</el-pagination>
			<!-- 弹窗, 新增 / 修改 -->
			<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
		</div>

	</el-card>
</template>

<script>
	import mixinViewModule from '@/mixins/view-module'
	import AddOrUpdate from './productGroupAddOrUpdate.vue'
	export default {
		mixins: [mixinViewModule],
		data() {
			return {
				mixinViewModuleOptions: {
					getDataListURL: '/api/productGroup/page',
					getDataListIsPage: true,
					deleteURL: '/api/productGroup',
					deleteIsBatch: true
				},
				dataForm: {
					id: '',
					groupName: '',
					isShow: '',
					sort: '',
					createDate: ''
				},
			}
		},
		components: {
			AddOrUpdate
		},
		created() {

		},
		methods: {}
	}
</script>
